<style scoped>
  .tpl .content-left{
    width: 120px;
    float: left;
  }
  .tpl .content-right{
    width: calc(100% - 140px);
    float: right;
  }
</style>
<template>
  <main class="tpl">
    <section class="clearfix">
      <section class="content-box content-left">
        <article style="min-height: auto" @click="update(1,modals[1])">
          <models :data.sync="modals[1]"></models>
        </article>
      </section>
      <section  class="content-box content-right">
        <article style="min-height: auto" @click="update(0,modals[0])">
          <models :data.sync="modals[0]"></models>
        </article>
      </section>
    </section>
  </main>
</template>

<script>
  import tpl from './tplmixin'

  export default {
    data () {
      return {
        modals: [
          {
            types:'',
            title:'',
            html:'<p>填写内容</p>',
            img:'',
            type:2
          },
          {
            type:'list',
            types:'',
            title:'',
            class:'',
            disable:true
          }
        ],
      }
    },
    mixins:[tpl],

  }

</script>
